
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Awesome go-echarts</title>
    <script src="http://127.0.0.1:8083/assets/echarts.min.js"></script>
    <script src="http://127.0.0.1:8083/assets/echarts-gl.min.js"></script>
    <link href="http://127.0.0.1:8083/assets/bulma.min.css" rel="stylesheet">
</head>

<body>
<div class="select" style="margin-right:10px; margin-top:10px; position:fixed; right:10px;">
    <select onchange="window.location.href=this.options[this.selectedIndex].value">
        <option value="http://127.0.0.1:8080/scatter3D">Scatter-(3D 散点图)</option>
        <option value="http://127.0.0.1:8080/bar3D">Bar3D-(3D 柱状图)</option>
        <option value="http://127.0.0.1:8080/boxPlot">BoxPlot-(箱线图)</option>
        <option value="http://127.0.0.1:8080/effectScatter">EffectScatter-(动态散点图)</option>
        <option value="http://127.0.0.1:8080/funnel">Funnel-(漏斗图)</option>
        <option value="http://127.0.0.1:8080/gauge">Gauge-仪表盘</option>
        <option value="http://127.0.0.1:8080/geo">Geo-地理坐标系</option>
        <option value="http://127.0.0.1:8080/graph">Graph-关系图</option>
        <option value="http://127.0.0.1:8080/heatMap">HeatMap-热力图</option>
        <option value="http://127.0.0.1:8080/kline">Kline-K 线图</option>
        <option value="http://127.0.0.1:8080/line">Line-(折线图)</option>
        <option value="http://127.0.0.1:8080/line3D">Line3D-(3D 折线图)</option>
        <option value="http://127.0.0.1:8080/liquid">Liquid-(水球图)</option>
        <option value="http://127.0.0.1:8080/map">Map-(地图)</option>
        <option value="http://127.0.0.1:8080/overlap">Overlap-(重叠图)</option>
        <option value="http://127.0.0.1:8080/parallel">Parallel-(平行坐标系)</option>
        <option value="http://127.0.0.1:8080/pie">Pie-(饼图)</option>
        <option value="http://127.0.0.1:8080/radar">Radar-(雷达图)</option>
        <option value="http://127.0.0.1:8080/sankey">Sankey-(桑基图)</option>
        <option value="http://127.0.0.1:8080/scatter">Scatter-(散点图)</option>
        <option value="http://127.0.0.1:8080/bar">Bar-(柱状图)</option>
        <option value="http://127.0.0.1:8080/surface3D">Surface3D-(3D 曲面图)</option>
        <option value="http://127.0.0.1:8080/themeRiver">ThemeRiver-(主题河流图)</option>
        <option value="http://127.0.0.1:8080/wordCloud">WordCloud-(词云图)</option>
        <option value="http://127.0.0.1:8080/page">Page-(顺序多图)</option>
    </select></div>

    
<div class="container">
    <div class="item" id="RjrVuTVTglGQ"
         style="width:900px;height:500px;"></div>
</div>
<script type="text/javascript">
    "use strict";
    let myChart_RjrVuTVTglGQ = echarts.init(document.getElementById('RjrVuTVTglGQ'), "white");
    let option_RjrVuTVTglGQ = {
        title: {"text":"Scatter3D-示例图",},
        tooltip: {},
        legend: {},
        visualMap:[{"calculable":true,"max":100,"inRange":{"color":["#313695","#4575b4","#74add1","#abd9e9","#e0f3f8","#fee090","#fdae61","#f46d43","#d73027","#a50026"]}}],
        xAxis3D: {},
        yAxis3D: {},
        zAxis3D: {},
        grid3D: {"boxWidth":200,"boxDepth":80,},
        series: [
        {"name":"scatter3d","type":"scatter3D","coordinateSystem":"cartesian3D","data":[[26,33,39],[95,87,78],[81,80,72],[25,19,28],[19,73,11],[49,89,42],[25,87,91],[76,27,53],[43,95,30],[31,76,87],[81,75,26],[55,74,59],[43,29,10],[72,15,29],[82,61,8],[65,30,59],[13,80,61],[70,45,67],[96,93,92],[51,14,4],[41,71,30],[27,16,23],[82,43,78],[70,38,3],[30,68,97],[59,81,5],[22,4,70],[83,86,42],[85,66,49],[37,17,44],[22,73,75],[13,68,84],[26,55,2],[21,50,52],[59,12,15],[26,7,99],[21,72,89],[30,30,95],[94,32,31],[9,48,8],[70,47,45],[31,99,43],[36,15,58],[17,38,63],[71,95,28],[90,43,30],[54,58,44],[20,60,27],[96,9,74],[38,4,30],[95,48,72],[56,88,12],[45,31,73],[95,36,49],[3,27,30],[47,18,82],[21,78,58],[47,80,61],[16,63,53],[85,82,56],[37,54,7],[66,0,22],[34,93,86],[81,35,11],[49,69,11],[59,31,21],[71,18,46],[79,65,73],[13,65,35],[11,60,10],[42,41,52],[90,81,85],[89,43,16],[99,37,25],[84,90,57],[62,83,69],[98,48,89],[77,30,26],[80,26,8],[81,65,20]],"label":{"show":false},"emphasis":{"label":{"show":false},},"markLine":{"label":{"show":false}},"markPoint":{"label":{"show":false}},},
        ],
        color: ["#c23531","#2f4554","#61a0a8","#d48265","#91c7ae","#749f83","#ca8622","#bda29a","#6e7074","#546570","#c4ccd3"],
    };
    myChart_RjrVuTVTglGQ.setOption(option_RjrVuTVTglGQ);
</script>

    <br/>
<style>
    .container {display: flex;justify-content: center;align-items: center;}
    .item {margin: auto;}
</style>
</body>
</html>
